<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>tab_wiget</title>
<script src='../lib/jquery-2.1.1.js'></script>
 <link rel="stylesheet" href="http://code.jquery.com/ui/1.10.3/themes/smoothness/jquery-ui.css" />
<script src="http://code.jquery.com/jquery-1.9.1.js"></script>
<script src="http://code.jquery.com/ui/1.10.3/jquery-ui.js"></script>

<script>
$(function(){
	 $("#tabs").tabs({
		 activate:function(event,ui){
			 if(ui.newTab.index()==4){
				 $('#tabs-5').load('./event_toggle.jsp');
			 }
		 }
		 
	 });
});

</script>

</head>
<body>

<div id="tabs">
	<ul>
		<li><a href="#tabs-1">HTML5소개</a></li>
		<li><a href="#tabs-2">CSS3 소개</a></li>
 		<li><a href="#tabs-3">Javascript 소개</a></li>  
 		<li><a href="#tabs-4">jQuery 소개</a></li>	
 		<li><a href="#tabs-5">이벤트</a></li>	
	</ul>

<div id="tabs-1">
	<ul>
		 <li>웹표준의 기본</li>
		 <li>호환성과 점진적 발전</li>
		 <li>외부 플러그인 없이 멀티미디어 재생</li>
	</ul>
</div>
<div id="tabs-2"> html이 할 수 없는 다양한  ui 표현.  </div>

 <div id="tabs-3">
 	<ul>
		 <li>가장 저 평가된 언어중 하나.</li>
		 <li>웹의 영역뿐만 아니라 애플리케이션에서도 활용할 수 있도록 개발진행</li> 
		 <li>서버 클라이언트 기능을 모두 스크트만으로 처리 될 수 있도록 개발진행</li>
 	</ul>
 
 </div>
 <div id="tabs-4">현재의 나?</div>
 <div id="tabs-5"></div>
 
 
 	
 </div>



</body>
</html>